<template>
    <div id="app">
        <a-modal v-model:visible="visable" :mask-closable="false" title="发布新版本" :width="500" @before-ok="doSubmit()"
            @cancel="close">
            <a-form ref="appForm" :model="formData" :rules="formRule" :label-col-props="{ span: 6 }" layout="vertical">
                <a-row :gutter="8">
                    <a-col :span="10">
                        <a-form-item label="平台类型" label-position="top" field="platform">
                            <a-select v-model="formData.platform" style="width:100%">
                                <a-option value="android">安卓</a-option>
                                <a-option value="ios">IOS</a-option>
                            </a-select>
                        </a-form-item>
                    </a-col>
                    <a-col :span="6">
                        <a-form-item label="版本号" label-position="top" field="version">
                            <a-input v-model="formData.version" placeholder="v1.0.0"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :span="7">
                        <a-form-item label="强制更新" label-position="top" field="isForce">
                            <a-radio-group button-style="solid" v-model="formData.isForce" :false-value="0" :true-value="1">
                                <a-radio :value="1">是</a-radio>
                                <a-radio :value="0">否</a-radio>
                            </a-radio-group>
                        </a-form-item>
                    </a-col>
                </a-row>
                <a-row :gutter="8">
                    <a-col :span="15">
                        <a-form-item label="更新包地址" label-position="top" field="url">
                            <a-input v-model="formData.url" placeholder="http://"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :span="9">
                        <a-form-item label="状态" label-position="top" field="isForce">
                            <a-radio-group button-style="solid" v-model="formData.status" :false-value="0" :true-value="1">
                                <a-radio :value="1">启用</a-radio>
                                <a-radio :value="0">关闭</a-radio>
                            </a-radio-group>
                        </a-form-item>
                    </a-col>
                </a-row>
                <a-row :gutter="8">
                    <a-col :span="24">
                        <a-form-item label="更新说明" label-position="top" field="description">
                            <a-textarea v-model="formData.description" placeholder="请输入本次更新内容" />
                        </a-form-item>
                    </a-col>
                </a-row>


            </a-form>
        </a-modal>
    </div>
</template>

<script lang="ts">
import { onBeforeMount, ref } from 'vue';
import utils from '@/utils/utils';
import request from '@/config/request';

export default {
    setup(props, { emit }) {
        const appForm = ref();
        const visable = ref(false);
        const formData = ref({
            id: ref(),
            platform: ref('android'),
            version: ref(''),
            description: ref(''),
            isForce: ref(1),
            url: ref(''),
            status: ref(1)
        });
        const formRule = ref({
            platform: [
                { required: true, message: '请选择平台类型' }
            ],
            version: [
                { required: true, message: '请输入版本号' }
            ],
            description: [
                { required: true, message: '请输入更新描述' }
            ],
            url: [
                { required: true, message: '请输入更新包下载地址' }
            ]
        });
        const show = (form: any) => {
            visable.value = true;
            appForm.value.resetFields();
            formData.value.id = '';
            if (form) {
                formData.value = JSON.parse(JSON.stringify(form));;
            }
        };
        const close = () => {
            visable.value = false;
        };
        const doSubmit = () => {
            return new Promise((resolve, reject) => {
                appForm.value.validate((valid: any) => {
                    if (valid) {
                        resolve(false)
                    }
                    utils.loading();
                    request.post('/platform/version/save', formData.value).then((ret: any) => {
                        resolve(true)
                        if (ret.code == 200) {
                            utils.success('操作成功！').then(() => {
                                appForm.value.resetFields();
                                visable.value = false;
                                emit('success');
                            })
                        }
                    }).catch(() => {
                        resolve(false)
                    })
                })
            })
        }
        return { appForm, visable, formData, formRule, show, close, doSubmit }
    },
}
</script>
